// pages/home/home.js
import { getElementRect } from '../../utils/common'
import { getBannerListApi } from '../../api/common'
import { getCategoryFirstApi, getGoodsListApi, getCategorySecondApi } from '../../api/goods'
import { getUserInfo } from '../../utils/user'

Page({
  /**
   * 页面的初始数据
   */
  data: {
    userInfo: getUserInfo(),
    navBarHeight: 0,
    navBarIsFixed: false,
    swiperData: {
      list: [],
      indicatorDots: true,
      autoplay: true,
      circular: true,
      interval: 3000
    },
    goodsListHeight: 0,
    categoryFirstList: [],
    firstActive: 0,
    categorySecondList: [],
    secondActive: 0,
    goodsList: [],
    isLoad: false
  },

  onfirstCateChange(e) {
    const firstActive = e.detail.index
    const secondActive = 0
    this.setData(
      {
        firstActive,
        secondActive,
        categorySecondList: this.data.categoryFirstList[firstActive]?.secondVOList
      },
      () => {
        this.getGoodsList()
      }
    )
  },

  onSecondCateChange(e) {
    const secondActive = e.target.dataset.index
    this.setData(
      {
        secondActive
      },
      () => {
        this.getGoodsList()
      }
    )
  },

  async getCategoryFirst() {
    const [err, list] = await getCategoryFirstApi()
    if (err) return
    this.setData(
      {
        categoryFirstList: list,
        categorySecondList: list[this.data.firstActive]?.secondVOList
      },
      () => {
        this.getGoodsList()
      }
    )
  },

  async getCategorySecond() {
    const [err, list] = await getCategorySecondApi()
    if (err) return
    this.setData(
      {
        categorySecondList: list
      },
      () => {
        this.getGoodsList()
      }
    )
  },

  async getGoodsList() {
    const firstId = this.data.categoryFirstList[this.data.firstActive]?.id ?? ''
    const secondId = this.data.categorySecondList[this.data.secondActive]?.id ?? ''
    const [err, list] = await getGoodsListApi({
      firstId,
      secondId
    })
    if (err) return
    this.setData({
      goodsList: list
    })
  },

  async getBannerList() {
    const [err, list] = await getBannerListApi()
    if (err) return
    this.setData({
      'swiperData.list': list
    })
  },

  swiperClick(e) {
    const { id, type, url } = e.currentTarget.dataset
    if (type === 1) {
      wx.navigateTo({
        // url: `/pages/h5/h5?url=${url}`
        url: `/pages/goodinfo/goodinfo?goodId=${url}`
      })
    } else {
      wx.navigateTo({
        url: `/pages/bannerInfo/bannerInfo?id=${id}`
      })
    }
  },

  /**
   * 初始化页面布局信息
   */
  async initPageRect() {
    const navBarRect = await getElementRect('#nav-bar', true, this)
    // const searchRect = await getElementRect('#search-box', true, this)
    // const swiperRect = await getElementRect('#swiper-box', true, this)
    const tabsRect = await getElementRect('#tabs-box', true, this)
    const { screenHeight } = wx.getSystemInfoSync()
    const tabBarHeight = wx.getStorageSync('tabBarHeight')
    // const goodsListHeight =
    //   screenHeight - navBarRect.height - searchRect.height - swiperRect.height - tabBarHeight
    const goodsListHeight = screenHeight - tabsRect.bottom - tabBarHeight
    this.setData({
      navBarHeight: navBarRect.height,
      goodsListHeight,
      navBarIsFixed: true
    })
  },

  initUserInfoByCache() {
    this.setData({
      userInfo: getUserInfo()
    })
  },

  /**
   * 跳转搜索页面
   */
  jumpSearch() {
    wx.navigateTo({
      url: '/pages/search/search'
    })
  },

  loginSuccess() {
    this.initUserInfoByCache()
  },

  /**
   * 生命周期函数--监听页面加载
   */
  async onLoad(options) {
    await this.getBannerList()
    await this.getCategorySecond()
    this.setData({
      isLoad: true
    })
    this.initPageRect()
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  async onReady() {
    // this.initPageRect()
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    this.getTabBar().init()
    this.initUserInfoByCache()
    if (this.data.isLoad) {
      this.getCategorySecond()
    }
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {},

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {},

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {}
})
